<template>
  <ul>
   <li v-for="(item, index) in data" :key="index" @click.stop="toggle(item)">
    {{item.text}}
    <Tree2 :data="item.children" v-if="item.expand"/>
  </li>
  </ul>
</template>

<script> 
/* 一个组件内部有自己的组件标签 */
export default {  // 
  name: 'Tree2', 
  props: ['data'],


  methods: {
    toggle(item) {
      if (!item.hasOwnProperty('expand')) {
        this.$set(item, 'expand', true)
      } else {
        item.expand = !item.expand
      }
    }
  }
}
</script>